<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="keywords" content="铜仁商务局管理后台">
    <meta name="description" content="">
    <meta name="author" content="vimi8.com">
    <meta name="renderer" content="webkit">
    <link rel="icon" href="icon.ico">
    <title>铜仁商务局管理后台</title>
    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.min.css">
    <link href="css/common.css" rel="stylesheet">
    <link href="css/farmDetail.css" rel="stylesheet">
    <link href="css/uploadFile.css" rel="stylesheet">

    <style type="text/css">
        #large{position:absolute;display:none;z-index:999;}
    </style>
</head>

<body>
<div class="zhezhao" id="zhezhao"></div>
<div id="wrapper">
    <div class="ht-top">
        <nav class="ht-navbar" role="navigation">
            <div class="ht-navbar-header">
                <a class="ht-navbar-brand" href="#">铜仁商务局管理后台</a>
            </div>
            <ul class="nav ht-navbar-nav">
                <!--<li class="active"><a href="#">1</a></li>
                <li><a href="#">2</a></li>-->
            </ul>
            <ul class="nav ht-navbar-nav navbar-right">
                <li class="active">
                    <span>下午好</span>&nbsp;&nbsp;
                    <span>为米1</span>&nbsp;&nbsp;
                </li>
                <li>
                    <img src="http://qzapp.qlogo.cn/qzapp/100414805/830A5F805EB7FBC2E1E03D5ADB844CA2/100" width="25" height="25" alt="" class="img-circle">&nbsp;&nbsp;
                </li>
                <li>
                    <a href="#" title="退出登录" class="active"><i class="fa fa-power-off"></i></a>
                </li>
            </ul>
        </nav>
    </div>
    <div class="ht-content">
        <aside class="ht-aside">
            <ul class="list-unstyled ht-aside-nav">
                <li>
                    <div class="ht-aside-item">
                        <a href="index.html" class="active"><i class="fa fa-home fa-fw"></i> 农场管理</a>
                    </div>
                </li>
                <li>
                    <div class="ht-aside-item">
                        <a href="porduct.html"><i class="fa fa-product-hunt fa-fw"></i> 产品管理</a>
                    </div>
                </li>
                <li>
                    <div class="ht-aside-item">
                        <a data-toggle="collapse" href="#collapseThree">
                            <i class="fa fa-sitemap fa-fw"></i> 分类管理
                            <i class="fa fa-angle-down angle"></i>
                        </a>
                    </div>

                    <div id="collapseThree" class="collapse in">
                        <ul class="list-unstyled">
                            <li class="ht-aside-item nl"><a href="farmclassify.html"><i class="fa fa-fw fa-code-fork text-muted"></i> 农场分类</a></li>
                            <li class="ht-aside-item nl"><a href="productclassify.html"><i class="fa fa-fw fa-cogs text-muted"></i> 产品分类</a></li>
                        </ul>
                    </div>
                </li>
            </ul>
        </aside>
        <div class="ht-main">
            <div class="ht-title">
                <h3 class="pull-left">农场管理</h3>
                <div class="pull-right">
                    <a class="btn btn-default" href="addPlatform.html"><i class="fa fa-plus"></i> 添加农场</a>
                </div>
            </div>

            <div class="ht-panel">
                <div class="panel panel-default">
                    <div class="panel-body">
                        <form class="form-horizontal" role="form">

                            <div class="form-group">
                                <label class="col-sm-2 control-label">图片</label>
                                <div class="col-sm-6">
                                    <div class="upload_box">
                                        <div class="upload_main">
                                            <div class="upload_choose">
                                                <input id="fileImage" type="file" size="30" name="fileselect[]" multiple style="float: left;"/>
                                                <span class="upload_submit">
                                                    <button type="button" id="fileSubmit" class="upload_submit_btn" style="float: right; margin-bottom: 10px;">上传</button>
                                                </span>
                                                <span id="fileDragArea" class="upload_drag_area">或者将图片拖到此处</span>
                                            </div>
                                            <div id="preview" class="upload_preview"></div>
                                            <div id="view" class="upload_preview"></div>
                                        </div>
                                        <span id="uploadInf" class="upload_inf"></span>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group">
                                <label for="name" class="col-sm-2 control-label">名称</label>
                                <div class="col-sm-6">
                                    <input type="text" class="form-control" id="name" placeholder="请输入农场名称">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="scale" class="col-sm-2 control-label">规模</label>
                                <div class="col-sm-6">
                                    <input type="number" step="0.01" class="form-control" id="scale" placeholder="请输入农场规模">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="scaleUnit" class="col-sm-2 control-label">规模单位</label>
                                <div class="col-sm-6">
                                    <input type="text" class="form-control" id="scaleUnit" placeholder="请输入农场规模单位">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="cate" class="col-sm-2 control-label">分类</label>
                                <div class="col-sm-6">
                                    <select name="cate" id="cate" class="form-control">

                                    </select>

                                    <script type="text/x-jsrender" id="FarmCategory">
                                       <option value="{{:id}}" >{{:categoryName}}</option>
                                     </script>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="address" class="col-sm-2 control-label">所在地</label>
                                <div class="col-sm-5">
                                    <input type="text" class="form-control" id="address" placeholder="请选择农场所在地" disabled>
                                </div>
                                <div class="col-sm-1">
                                    <a href="#" class="btn" data-toggle="modal" data-target="#selectCateModal">修改</a>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="add" class="col-sm-2 control-label">详细地址</label>
                                <div class="col-sm-6">
                                    <input type="text" class="form-control" id="add" placeholder="请输入农场详细地址">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="brief" class="col-sm-2 control-label">简介</label>
                                <div class="col-sm-6">
                                    <textarea rows="4" class="form-control" id="brief" placeholder="请输入农场简介"></textarea>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">是否显示</label>
                                <div class="col-sm-6">
                                    <label class="checkbox-inline">
                                        <input type="radio" name="optionsRadiosinline" id="optionsRadios3" value="option1" checked>显示
                                    </label>
                                    <label class="checkbox-inline">
                                        <input type="radio" name="optionsRadiosinline" id="optionsRadios4" value="option2">不显示
                                    </label>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">星级</label>
                                <div class="col-sm-6">
                                    <input type="number" class="form-control" id="star" placeholder="请输入农场星级(1~5)">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">经纬度</label>
                                <div class="col-sm-6">
                                    <div style="padding: 10px; background-color: #EEEEEE;position: relative;">
                                        <div style="margin-bottom: 10px;">
                                            经度：<input id="lon" type="number" step="0.000001" class="form-control sm" name="lng" placeholder="经度" value="" disabled>
                                            纬度：<input id="lat" type="number" step="0.000001" class="form-control sm" name="lat" placeholder="纬度" value="" disabled>
                                            <span class="text-muted">点击下面地图获取经纬度</span>
                                        </div>
                                        <div id="mapContainer"></div>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">内容</label>
                                <div class="col-sm-10">
                                    <!-- 加载编辑器的容器 -->
                                    <script id="container" name="content" type="text/plain" name="content">内容</script>
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="col-sm-offset-2 col-sm-10">
                                    <a href="#" type="submit" class="btn btn-default" onclick="updateFA()">确认</a>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 选择产品分类弹出窗 -->
<div class="modal fade select-cate" id="selectCateModal" tabindex="-1" data-backdrop="static" role="dialog" aria-labelledby="selectCateModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="selectCateModalLabel">选择所在地</h4>
            </div>
            <div class="modal-body">
                <div class="secect-cate-level">
                    <p class="text-muted">省</p>
                    <select name="cate1" id="oneClassify" size="20">
                        <option value="520000000000" >贵州省</option>
                    </select>
                    <script type="text/x-jsrender" id="oneClassifyTemp">
                            <option value="{{:id}},{{:categoryLevel}}">{{:categoryName}}</option>
                        </script>
                </div>
                <div class="secect-cate-level">
                    <p class="text-muted">市</p>
                    <select name="cate2" id="twoClassify" size="20" onchange="upaCity()">

                    </select>

                    <script type="text/x-jsrender" id="twoClassifyTemp">
                             <option value="{{:id}}" >{{:geoName}}</option>
                        </script>
                </div>
                <div class="secect-cate-level">
                    <p class="text-muted">县</p>
                    <select name="cate3" id="threeClassify" size="20" onchange="upaXian()">
                    </select>
                    <script type="text/x-jsrender" id="threeClassifyTemp">
                             <option value="{{:id}}" >{{:geoName}}</option>
                        </script>
                </div>
                <div class="secect-cate-level">
                    <p class="text-muted">乡/镇</p>
                    <select name="cate4" id="fourClassify" size="20" onchange="upaXiang()">
                    </select>
                    <script type="text/x-jsrender" id="fourClassifyTemp">
                             <option value="{{:id}}" >{{:geoName}}</option>
                        </script>
                </div>
                <div class="secect-cate-level">
                    <p class="text-muted">村</p>
                    <select name="cate4" id="fiveClassify" size="20">
                    </select>
                    <script type="text/x-jsrender" id="fiveClassifyTemp">
                             <option value="{{:id}}" >{{:geoName}}</option>
                        </script>
                </div>
            </div>
            <div class="modal-footer">
                <!-- <button type="button" class="btn btn-default" data-dismiss="modal">取消</button> -->
                <button type="button" onclick="makeSureClassify()" class="btn btn-primary" id="selectCatecomfirm">确认</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="uploadImg" tabindex="-1" data-backdrop="static" role="dialog" aria-labelledby="selectCateModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">上传图片</h4>
            </div>
            <div class="modal-body">
                <div id="imgUploadWrapper"></div>
            </div>
            <div class="modal-footer">
                <button type="button" id="uploadImgConfirm" class="btn btn-primary">确认</button>
            </div>
        </div>
    </div>
</div>

<script src="node_modules/jquery/dist/jquery.min.js"></script>
<script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="node_modules/jsviews/jsviews.min.js"></script>
<script src="node_modules/twbs-pagination/jquery.twbsPagination.min.js"></script>
<script src="http://gosspublic.alicdn.com/aliyun-oss-sdk-4.4.4.min.js"></script>
<script src="js/ueditor-1.4.3.3/ueditor.config.js"></script>
<script src="js/ueditor-1.4.3.3/ueditor.all.js"></script>
<!--高德地图-->
<script src="http://webapi.amap.com/maps?v=1.3&key=d386663c19f421e1130e204a6bae281d"></script>
<script src="js/common.js"></script>
<script src="js/uploadFile.js"></script>
<script src="js/updateFarm.js"></script>


<!-- plupload -->
<script src="js/plupload/crypto.js"></script>
<script src="js/plupload/hmac.js"></script>
<script src="js/plupload/sha1.js"></script>
<script src="js/plupload/base64.js"></script>
<script src="js/plupload/plupload.full.min.js"></script>
<script src="js/plupload/upload.js"></script>

<script>
    var params = {
        fileInput: $("#fileImage").get(0),
        dragDrop: $("#fileDragArea").get(0),
        upButton: $("#fileSubmit").get(0),
        url: $("#uploadForm").attr("action"),
        filter: function(files) {
            var arrFiles = [];
            for (var i = 0, file; file = files[i]; i++) {
                if (file.type.indexOf("image") == 0) {
                    if (file.size >= 2097152) {//1024*1024*2
                        alert('您这张"'+ file.name +'"图片大小过大，应小于2M');
                    }  else {
                        arrFiles.push(file);
                    }
                } else {
                    alert('文件"' + file.name + '"不是图片。');
                }
            }
            return arrFiles;
        },
        onSelect: function(files) {
            var html = '', i = 0;
            $("#preview").html('<div class="upload_loading"></div>');
            var funAppendImage = function() {
                file = files[i];
                if (file) {
                    var reader = new FileReader()
                    reader.onload = function(e) {
                        if(file.name.length>10){
                            file.name1=file.name.substring(0,10)+"…";
                        }else{
                            file.name1=file.name;
                        }
                        html = html + '<div id="uploadList_'+ i +'" class="upload_append_list"><p><strong>' + file.name1 + '</strong>'+
                                '<a href="javascript:" class="upload_delete" title="删除" data-index="'+ i +'">删除</a><br />' +
                                '<img id="uploadImage_' + i + '" src="' + e.target.result + '" class="upload_image" /></p>'+
                                '<span id="uploadProgress_' + i + '" class="upload_progress"></span>' +
                                '</div>';

                        i++;
                        funAppendImage();
                    }
                    reader.readAsDataURL(file);
                } else {
                    $("#preview").html(html);
                    if (html) {
                        //删除方法
                        $(".upload_delete").click(function() {
                            uploadFile.funDeleteFile(files[parseInt($(this).attr("data-index"))]);
                            return false;
                        });
                        //提交按钮显示
                        $("#fileSubmit").show();
                    } else {
                        //提交按钮隐藏
                        $("#fileSubmit").hide();
                    }
                }
            };
            funAppendImage();
        },
        onDelete: function(file) {
            $("#uploadList_" + file.index).fadeOut();
        },
        onExistsDelete:function (fileUrl,index) {
            $("#existsList_"+ index).fadeOut();
        },
        onDragOver: function() {
            $(this).addClass("upload_drag_hover");
        },
        onDragLeave: function() {
            $(this).removeClass("upload_drag_hover");
        },
        onProgress: function(file, loaded, total) {
            var eleProgress = $("#uploadProgress_" + file.index), percent = (loaded / total * 100).toFixed(2) + '%';
            eleProgress.show().html(percent);
        },
        onSuccess: function(file, response) {
            $("#uploadInf").append(file.name +"<span>上传成功&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>");//，图片地址是：" + response + "
        },
        onFailure: function(file) {
            $("#uploadInf").append("<span>图片" + file.name + "上传失败！&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>");
            $("#uploadImage_" + file.index).css("opacity", 0.2);
        },
        onComplete: function(arr,str) {
            //提交按钮隐藏
            $("#fileSubmit").hide();
            //file控件value置空
            $("#fileImage").val("");
            $("#view").html('<div class="upload_view"></div>');
            var array=[];
            array=arr;
            if(array&&array.length>0){
                var html = ''
                for(var i=0;i<array.length;i++){

                    html = html + '<div id="existsList_'+ i +'" class="upload_append_list"><p>' +
                            '<a href="javascript:" class="img_delete" title="删除" data-index="'+ i +'">删除</a><br/>' +
                            '<img id="uploadImage_' + i + '" src="' +array[i] + '"class="upload_image" /></p>'+
                            '</div>';
                }
                $("#view").html(html);
                //删除方法
                $(".img_delete").click(function() {
                    //uploadFile.funDeleteFile(files[parseInt($(this).attr("data-index"))]);
                    uploadFile.existsDeleteFile(array[parseInt($(this).attr("data-index"))],parseInt($(this).attr("data-index")));
                    return false;
                });
            }

        }
    };
    uploadFile = $.extend(uploadFile, params);
    uploadFile.init();
</script>
</body>

</html>
